<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta http-equiv="Cache-Control" content="private">
		<meta content="telephone=no,email=no" name="format-detection">
		<meta content="yes" name="apple-mobile-web-app-capable">
		<meta http-equiv="Access-Control-Allow-Origin" content="*" />
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title>选择支付类型</title>
		
		<link rel="stylesheet" href="./css/bootstrap/css/bootstrap.css">
		<link rel="stylesheet" href="./css/common/style.css">
		<script src="./js/lib/rem.js"></script>
		<script src="./js/lib/jquery-3.3.1.min.js"></script>
		<script src="./js/lib/common.js"></script>
		
	</head>
	<style>
		.balance{width:100%;height:100%;background:#f2f2f2;position:fixed;}
		.head{width:100%;height:1rem;line-height:1rem;text-align:center;background:#0c5dac;position:relative}
		.head-back{width:20%;height:1rem;position:absolute;left:0;top:0;display:flex;flex-direction:row;align-items:center;justify-content:center;}
		.head-back > i.back{width:0.4rem;height:0.4rem;display:inline-block;background:url('./img/icons/left.png') no-repeat;background-size:0.4rem;}
		.head-back > span{font-size:0.3rem;color:#fff;}
		.head-title{width:100%;height:1rem;line-height:1rem;text-align:center;background:#0c5dac;}
		.head-title > span{font-size:0.34rem;color:#fff;}
		
		.balance-account{width:100%;height:calc(100% - 1rem);}
		.putforward-bank{display:none;width:100%;height:1rem;margin-top:0.3rem;background:#fff;display:flex;flex-direction:row;}
		.bank-img{width:25%;height:1rem;line-height:1rem;text-align:center;}
		.bank-img > img{width:0.5rem;height:0.5rem;}
		.bank-infor{width:60%;height:1rem;display:flex;flex-direction:column;justify-content:center;}
		.bank-infor > span{color:#222;font-size:0.32rem;}
		.bank-infor > p{color:#999;font-size:0.26rem;margin:0 !important;}
		.select{width:15%;height:1rem;display:flex;flex-direction:row;justify-content:center;align-items:center;}
		.select > i.selectok{width:0.55rem;height:0.3rem;display:block;background:url('./img/icons/select-ok.png') no-repeat;background-size:0.55rem 0.3rem;}

		.putforward-btn{width:100%;height:0.8rem;margin-top:0.5rem;text-align:center;}
		.putforward-btn > button{width:80%;height:0.8rem;line-height:0.8rem;border:none;outline:none;border-radius:0.1rem;background:#9bcbf1;color:#efefef;font-size:0.32rem;}
		.putforward-btn > button.enableBtn{background:#0c5dac;color:#fff;}
		
	</style>
	<body>
		<div class="balance">
			<div class="head">
				<div class="head-back" onClick='javascript:history.go(-1);'>
					<i class="back"></i>
					<span>取消</span>
				</div>
				<div class="head-title">
					<span>选择支付类型</span>
				</div>
			</div>
			
			<div class="balance-account" id="bankList">
				<div class="putforward-bank" data-style="alipay">
					<div class="bank-img">
						<img src="./img/icons/alipay-pic.png" alt="">
					</div>
					<div class="bank-infor">
						<span>支付宝收款</span>
					</div>
					<div class="select">
						<i class=""></i>
					</div>
				</div>
				
				<div class="putforward-bank" data-style="wxpay">
					<div class="bank-img">
						<img src="./img/icons/wxpay-pic.png" alt="">
					</div>
					<div class="bank-infor">
						<span>微信收款</span>
					</div>
					<div class="select">
						<i class=""></i>
					</div>
				</div>
				
				<!-- <div class="putforward-bank">
					<div class="bank-img">
						<img src="./img/bank-zg.png" alt="">
					</div>
					<div class="bank-infor">
						<span>中国银行</span>
						<p>尾号3456 储蓄卡</p>
					</div>
					<div class="select">
						<i class="selectok"></i>
					</div>
				</div> -->

			</div>
			
		</div>
		
		<div id="taskdiv"></div>
		
		<!-- putforward modal -->
		<div class="infor-modal" id="inforModal">
			<div class="infor-inner">
				<div class="infor-contain">
					<div class="informodal-title">
						<div class="modal-title">
							<span>试玩助手</span>
						</div>
					</div>
					<div class="inforModal-content">
						<span id="inforContextTitle"></span>
						<span id="inforContext"></span>
					</div>
				</div>
			</div>
		</div>
		
		<script src="./js/sendtask.js?v=1043"></script>
		<script type="text/javascript" src="./js/lib/map/maps.js"></script>
		<script src="./js/lib/mui/mui.min.js"></script>
		
		<script>
			$(function(){
				
				var taskstate = localStorage.getItem('taskstate');
				if(taskstate === "true"){
					//after five minutes send task start
					setTimeSendTaskStart();
				}
				
				var urlip = localStorage.getItem('urlip');
				var url = 'http://'+ urlip +':8080/platform-web/';
				
				var userid = localStorage.getItem('userid');
				var curpaystyle = parseInt(localStorage.getItem('paystyle'));
				
				$('.select').eq(curpaystyle-1).children('i').addClass('selectok');
				
				
				var aliputforwardimg = localStorage.getItem('aliputforwardimg');
				if(aliputforwardimg === "true"){
					$('#bankList > div:eq(0)').show();
				}else{
					$('#bankList > div:eq(0)').hide();
				}
				
				var wxputforwardimg = localStorage.getItem('wxputforwardimg');
				if(wxputforwardimg === "true"){
					$('#bankList > div:eq(1)').show();
				}else{
					$('#bankList > div:eq(1)').hide();
				}
				
				
				$('#bankList').children('div').each(function(){
					
					var payStyle = $(this).attr('data-style')
					$(this).click(function(){
						localStorage.setItem('paystyle',payStyle);
						$(this).children('div.select').children('i').addClass('selectok')
						$(this).siblings('div').children('div.select').children('i').removeClass('selectok')
						setTimeout(function(){
							location.href = './putforward.html'
						},800);
					});
					
				});
				
				
				
				
				
			});
		</script>
	</body>
</html>
